import * as echarts from 'echarts'
export function echarts1(data) {
  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
    },
    legend: {
      right: "0",
      top: "0",
      itemWidth: 10,
      itemHeight: 10,
      textStyle: {
        color: "rgb(255,255,255,1)",
      },
    },
    color: ["#36ecfe", "#ffdf8e"],
    grid: {
      left: "5%",
      right: "5%",
      bottom: "-15%",
      top: "10%",
      containLabel: true,
    },
    xAxis: {
      show: false,
      type: "value",
      boundaryGap: [0, 0.01],
      axisTick: {
        show: false,
      },
      axisLine: {
        show: false,
      },
      splitLine: {
        show: false,
      },
    },
    yAxis: {
      type: "category",
      data: data.class,
      axisTick: {
        show: false,
      },
      axisLabel: {
        color: "#42ebf7",
      },
      axisLine: {
        show: false,
      },
    },
    series: [
      {
        name: "男性",
        type: "bar",
        barWidth:15,
        data: data.man,
      },
      {
        name: "女性",
        type: "bar",
        barWidth:15,

        data: data.woman,
      },
    ],
  };
  myChart.setOption(option);
}
export function echarts2(data) {
  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
    },
    legend: {
      right: "0",
      top: "0",
      itemWidth: 10,
      itemHeight: 10,
      textStyle: {
        color: "rgb(255,255,255,1)",
      },
    },
    color: ["#36ecfe", "#ffdf8e"],
    grid: {
      left: "5%",
      right: "5%",
      bottom: "-15%",
      top: "10%",
      containLabel: true,
    },
    xAxis: {
      show: false,
      type: "value",
      boundaryGap: [0, 0.01],
      axisTick: {
        show: false,
      },
      axisLine: {
        show: false,
      },
      splitLine: {
        show: false,
      },
    },
    yAxis: {
      type: "category",
      data: data.class,
      axisTick: {
        show: false,
      },
      axisLabel: {
        color: "#42ebf7",
      },
      axisLine: {
        show: false,
      },
    },
    series: [
      {
        name: "男性",
        type: "bar",
        data: data.man
      },
      {
        name: "女性",
        type: "bar",
        data: data.woman ,
      },
    ],
  };
  myChart.setOption(option);
}
export function echarts3(data) {
  return {
    color: [
      "#1d75f0",
      "#ff701a",
      "#ffa11a",
      "#ffea00",
      "#00a8ff",
      "#3fffea",
      "#00e436",
    ],
    tooltip: {
      trigger: "item",
    },
    legend: {
      // 距离底部距离设置
      top: '5%',
      right: "10%",
      left: "75%",
      bottom: "20%",
      //小图标宽度设置
      itemWidth: 10,
      itemHeight: 10,
      //图例组件文字样式
      textStyle: {
        color: "rgb(255,255,255,1)",
      },
    },
    grid: {
      left: "5%",
      right: "5%",
      bottom: "5%",
      containLabel: true,
    },
    series: [
      {
        name: "类型人数",
        type: "pie",
        radius: ["40%", "70%"],
        avoidLabelOverlap: false,
        center: ["35%", "50%"],
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: false,
            fontSize: "20",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: data,
      },
    ],
  };

}
export function echarts4(data) {
  return {
    tooltip: {
      trigger: "item",
    },
    legend: {
      orient: "vertical",
      // 距离底部距离设置
      left: "10%",
      bottom: "18%",
      //小图标宽度设置
      itemWidth: 13,
      itemHeight: 13,
      //图例组件文字样式
      textStyle: {
        color: "#2683d6",
      },
    },
    series: [
      {
        color: ["#c19aff", "#7ce7fb", "#fb85a7", "#00bce4"],
        name: "收入来源",
        type: "pie",
        label: {
          show: true,
          fontSize: "14",
          fontWeight: "normal",
          color: "#fff",
        },
        center: ["65%", "40%"],
        radius: ["40%", "68%"],
        data: data,
      },
    ],
  };

}
export function echarts5(ylX,ylY1,ylY2) {
  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
    },
    axisLabel: {
      color: "#fff",
      fontSize: "12",
    },
    grid: {
      left: "5%",
      right: "5%",
      bottom: "0%",
      top: "5%",
      containLabel: true,
    },
    toolbox: {
      show: true,
      orient: "vertical",
      left: "right",
      top: "center",
    },
    xAxis: [
      {
        type: "category",
        axisTick: { show: false },
        data: ylX,
      },
    ],
    yAxis: [
      {
        type: "value",
        axisLine: {
          show: false,
        },
        splitLine: {
          lineStyle: {
            color: "rgba(255,255,255,.1)",
            width: 2,
          },
        },
      },
    ],
    series: [
      {
        name: "养老",
        type: "bar",
        barGap: 0,
        emphasis: {
          focus: "series",
        },
        data: ylY1,
        itemStyle: {
          normal: {
            //渐变色--------------------
            color: new echarts.graphic.LinearGradient(
              0,
              1,
              0,
              0,
              [
                {
                  offset: 0,
                  color: "#3dc7f7", // 0% 处的颜色
                },
                {
                  offset: 0.4,
                  color: "#52dadd", // 60% 处的颜色
                },
                {
                  offset: 1,
                  color: "#76fdae", // 100% 处的颜色
                },
              ],
              false
            ),
            // 圆柱radius------------------
            barBorderRadius: 4,
          },
        },
        //圆柱宽度-----------------------------
        barWidth: "26%",
      },
      {
        name: "医疗",
        type: "bar",
        emphasis: {
          focus: "series",
        },
        data: ylY2,
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(
              0,
              1,
              0,
              0,
              [
                {
                  offset: 0,
                  color: "#41c4f9", // 0% 处的颜色
                },
                {
                  offset: 0.4,
                  color: "#7cacf6", // 60% 处的颜色
                },
                {
                  offset: 1,
                  color: "#fe77ef", // 100% 处的颜色
                },
              ],
              false
            ),
            barBorderRadius: 4,
          },
        },
        barWidth: "26%",
      },
    ],
  };

}
export function echarts6(pxName,pxValue) {
  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        // 坐标轴指示器，坐标轴触发有效
        type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
      },
    },
    grid: {
      left: "5%",
      right: "5%",
      bottom: "0%",
      top: "5%",
      containLabel: true,
    },
    axisLabel: {
      color: "#fff",
      fontSize: "12",
    },
    xAxis: [
      {
        type: "category",
        data: pxName,
        axisTick: {
          alignWithLabel: true,
        },
      },
    ],
    yAxis: [
      {
        type: "value",
        axisLabel: {
          color: "#fff",
          fontSize: "12",
        },
        axisLine: {
          show: false,
        },
        splitLine: {
          lineStyle: {
            color: "rgba(255,255,255,.1)",
            width: 2,
          },
        },
      },
    ],
    series: [
      {
        name: "培训人数",
        type: "bar",
        barWidth: "60%",
        data: pxValue,
        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(
              0,
              1,
              0,
              0,
              [
                {
                  offset: 0,
                  color: "#41c4f9", // 0% 处的颜色
                },
                {
                  offset: 0.4,
                  color: "#7cacf6", // 60% 处的颜色
                },
                {
                  offset: 1,
                  color: "#fe77ef", // 100% 处的颜色
                },
              ],
              false
            ),
            barBorderRadius: 4,
          },
        },
        barWidth: "26%",
      },
    ],
  };

}
export function echarts7(jiegouName,jiegoudata) {
  var data = jiegoudata;
  let all = jiegoudata.reduce((prv, cur) => {
    return prv + cur
  },0)
  data = jiegoudata.map(val => {
    return ((val/all)*100).toFixed(0)
  })
  var dataY = jiegouName;
  return {
    //图标位置
    grid: {
      top: "5%",
      left: "22%",
      bottom: "-5%",
    },
    xAxis: {
      show: false,
    },
    yAxis: [
      {
        show: true,
        data: dataY,
        inverse: true,
        axisLine: {
          show: false,
        },
        splitLine: {
          show: false,
        },
        axisTick: {
          show: false,
        },
        axisLabel: {
          color: "#fff",
          rich: {
            lg: {
              backgroundColor: "#339911",
              color: "#fff",
              borderRadius: 15,
              // padding: 5,
              align: "center",
              width: 15,
              height: 15,
            },
          },
        },
      },
      {
        show: false,
        inverse: true,
        data: data,
        axisLabel: {
          textStyle: {
            fontSize: 12,
            color: "#fff",
          },
        },
      },
    ],
    series: [
      {
        name: "条",
        type: "bar",
        yAxisIndex: 0,
        data: data,
        barCategoryGap: 50,
        barWidth: 15,
        itemStyle: {
          normal: {
            barBorderRadius: 0,
            color: "#93ebfb",
          },
        },
        label: {
          show: true,
          position: "right",
          formatter: "{c}%",
          fontSize: "12",
          fontWeight: "normal",
          color: "#fff",
        },
      },
    ],
  };

}
export function echarts8(fenxiName,fenxiValue) {
  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        // 坐标轴指示器，坐标轴触发有效
        type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
      },
    },
    grid: {
      left: "5%",
      right: "5%",
      bottom: "0%",
      top: "5%",
      containLabel: true,
    },
    axisLabel: {
      color: "#fff",
      fontSize: "12",
    },
    xAxis: [
      {
        type: "category",
        data: fenxiName,
        axisTick: {
          alignWithLabel: true,
        },
      },
    ],
    yAxis: [
      {
        type: "value",
        axisLabel: {
          color: "#fff",
          fontSize: "12",
        },
        axisLine: {
          show: false,
        },
        splitLine: {
          lineStyle: {
            color: "rgba(255,255,255,.1)",
            width: 2,
          },
        },
      },
    ],
    series: [
      {
        name: "健康分析",
        type: "bar",
        barWidth: "60%",
        data: fenxiValue,
        itemStyle: {
          normal: {
            //渐变色--------------------
            color: new echarts.graphic.LinearGradient(
              0,
              1,
              0,
              0,
              [
                {
                  offset: 0,
                  color: "#3dc7f7", // 0% 处的颜色
                },
                {
                  offset: 0.4,
                  color: "#52dadd", // 60% 处的颜色
                },
                {
                  offset: 1,
                  color: "#76fdae", // 100% 处的颜色
                },
              ],
              false
            ),
            // 圆柱radius------------------
            barBorderRadius: 4,
          },
        },
        //圆柱宽度-----------------------------
        barWidth: "26%",
      },
    ],
  };

}
export function echarts9(data) {
  return {
    //图标颜色
    color: ["#2889fe", "#2cd1c0", "#ffa06c", "#fedb65"],
    tooltip: {
      trigger: "item",
    },
    legend: {
      // 距离底部距离设置
      right: "20%",
      left: "70%",
      bottom: "20%",
      //小图标宽度设置
      itemWidth: 12,
      itemHeight: 12,
      //图例组件文字样式
      textStyle: {
        color: "rgb(255,255,255,1)",
      },
    },
    series: [
      {
        name: "",
        type: "pie",
        //调整大小
        radius: ["40%", "70%"],
        //饼状图位置
        center: ["35%", "55%"],
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: false,
            fontSize: "40",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: data,
      },
    ],
  };

}
export function echarts10(data) {
  return {
    tooltip: {
      trigger: "item",
    },
    legend: {
      orient: "vertical",
      // 距离底部距离设置
      top: "25%",
      right: "20%",
      left: "60%",
      //小图标宽度设置
      itemWidth: 12,
      itemHeight: 12,
      //图例组件文字样式
      textStyle: {
        color: "#2683d6",
      },
    },
    series: [
      {
        color: ["#fedb65", "#ffa06c", "#9fe6b8", "#32c5e9", "#9d96f5"],
        name: "访问来源",
        type: "pie",
        //饼状图位置
        center: ["30%", "55%"],
        radius: "80%",
        //调整大小
        data: data,
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: "center",
        },
      },
    ],
  };

}
export function echarts11(date,data) {
  return {
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    color: ['#186ed0','#0eb0a1','#62acf5'],
    legend: {
      top: 10,
      textStyle: {
        color: "rgb(255,255,255,1)",
      },
    },
    grid: {
      top: '20%',
      left: '3%',
      right: '4%',
      bottom: '-1%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      boundaryGap: [0, 0.01],
      data: date,
      axisLine: {
        show: true,
        lineStyle: {
          color: '#6a8bbc'
        }
      },
      splitLine: {
        show: false
      },
      axisTick: {
        show: true
      }
    },
    yAxis: {
      type: 'value',
      axisLabel: {
        show: true
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#6a8bbc'
        }
      },
    },
    series: data
  };
}
export function echarts12(data) {
  return {
    title: [
      {
        text: "养老",
        x: "center",
        top: "55%",
        textStyle: {
          color: "#FFFFFF",
          fontSize: 16,
          fontWeight: "100",
        },
      },
      {
        text: data+"%",
        x: "center",
        top: "30%",
        textStyle: {
          fontSize: "20",
          color: "#FFFFFF",
          fontFamily: "DINAlternate-Bold, DINAlternate",
          foontWeight: "600",
        },
      },
    ],
    polar: {
      radius: ["60%", "80%"],
      center: ["50%", "50%"],
    },
    angleAxis: {
      max: 100,
      show: false,
    },
    radiusAxis: {
      type: "category",
      show: true,
      axisLabel: {
        show: false,
      },
      axisLine: {
        show: false,
      },
      axisTick: {
        show: false,
      },
    },
    series: [
      {
        name: "",
        type: "bar",
        roundCap: true,
        barWidth: 50,
        showBackground: true,
        backgroundStyle: {
          color: "rgba(66, 66, 66, .3)",
        },
        data: [Number(data)],
        coordinateSystem: "polar",

        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
              {
                offset: 0,
                color: "#04b5c1",
              },
              {
                offset: 1,
                color: "#066e89",
              },
            ]),
          },
        },
      },
      {
        name: "",
        type: "pie",
        startAngle: 80,
        radius: ["60%"],
        hoverAnimation: false,
        center: ["50%", "50%"],
        itemStyle: {
          color: "rgba(66, 66, 66, .1)",
          borderWidth: 1,
          borderColor: "#5269EE",
        },
        data: [100],
      },
      {
        name: "",
        type: "pie",
        startAngle: 80,
        radius: ["80%"],
        hoverAnimation: false,
        center: ["50%", "50%"],
        itemStyle: {
          color: "rgba(66, 66, 66, .1)",
          borderWidth: 1,
          borderColor: "#5269EE",
        },
        data: [100],
      },
    ],
  };
}
export function echarts13(data) {
  return {
    title: [
      {
        text: "医疗",
        x: "center",
        top: "55%",
        textStyle: {
          color: "#FFFFFF",
          fontSize: 16,
          fontWeight: "100",
        },
      },
      {
        text: data+"%",
        x: "center",
        top: "30%",
        textStyle: {
          fontSize: "20",
          color: "#FFFFFF",
          fontFamily: "DINAlternate-Bold, DINAlternate",
          foontWeight: "600",
        },
      },
    ],
    polar: {
      radius: ["60%", "80%"],
      center: ["50%", "50%"],
    },
    angleAxis: {
      max: 100,
      show: false,
    },
    radiusAxis: {
      type: "category",
      show: true,
      axisLabel: {
        show: false,
      },
      axisLine: {
        show: false,
      },
      axisTick: {
        show: false,
      },
    },
    series: [
      {
        name: "",
        type: "bar",
        roundCap: true,
        barWidth: 60,
        showBackground: true,
        backgroundStyle: {
          color: "rgba(66, 66, 66, .3)",
        },
        data: [Number(data)],
        coordinateSystem: "polar",

        itemStyle: {
          normal: {
            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
              {
                offset: 0,
                color: "#009bdf",
              },
              {
                offset: 1,
                color: "#009bdf",
              },
            ]),
          },
        },
      },
      {
        name: "",
        type: "pie",
        startAngle: 80,
        radius: ["60%"],
        hoverAnimation: false,
        center: ["50%", "50%"],
        itemStyle: {
          color: "rgba(66, 66, 66, .1)",
          borderWidth: 1,
          borderColor: "#5269EE",
        },
        data: [100],
      },
      {
        name: "",
        type: "pie",
        startAngle: 80,
        radius: ["80%"],
        hoverAnimation: false,
        center: ["50%", "50%"],
        itemStyle: {
          color: "rgba(66, 66, 66, .1)",
          borderWidth: 1,
          borderColor: "#5269EE",
        },
        data: [100],
      },
    ],
  };
}